<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>人员管理系统</title>
		<style type="text/css">
			body{
				margin: 0;
				background-image: url(img/login/login.gif);
		        background-size: 100% 960px;
				overflow: auto;
				background-repeat: no-repeat;				
				background-attachment: fixed;
			}
			/*设置上层块，添加背景图片，设置高度为43px*/
			#top01{
				margin: 0;
				background-image: url(img/login/topBg.gif);
				height:43px;	
			}
			/*添加一个图片，左浮动*/
			#top02{
				float: left;
			}
			/*欢迎语，字体颜色白色*/
			#top03{
				color: white;
				margin-top: 8px;
				float: left;
			}
			/*右侧超链接*/
			#top04{
				color: white;
				margin-top: 8px;
				float: right;
			}
			/*设置标题，字体颜色白色，大小40pt*/
			#renyuan{
				width: 600px;
				font-size: 40pt;
				background-color:#3399ff;
				color: white;
				margin: 30px 0px 0px 735px;
				}
			#yonghudenglu{
				font-size: 17pt;
				color:cornflowerblue;
				margin: 200px 0px 0px 860px;
			}
			/*设置用户名输入框图片的的位置*/
			#username{
				margin: 30px 0px 0px 860px;
			}	
			/*设置用户名文本框，透明*/	
			#username01{
				border: 0px;
				height: 43px;
				width: 301px;
				position: absolute;
				top: 405px;
				left: 900px;
				background: rgba(0,0,0,0);
			}	
			/*设置密码输入框图片的位置*/
			#password{
				margin: 30px 0px 0px 860px;
			}
			/*设置密码文本框，透明*/
			#password01{
				border: 0px;
				height: 43px;
				width: 301px;
				position: absolute;
				top: 486px;
				left: 900px;
				background: rgba(0,0,0,0);
			}	
			/*设置登录链接背景图片位置*/
			#denglu{
				margin: 60px 0px 0px 860px;
			}
			/*设置登录链接*/
			#denglu01{
				color: white;
				font-size: 18pt;
				top:578px;
				left: 873px;
				position: absolute;
			}
			/*验证码输入框位置*/
			#yanzhengma{
				top: 597px;
				left: 990px;
				position: absolute;
				width: 70px;
				height: 36px;
			}
			/*设置验证码图片位置*/
			#yanzhengma01{
				top: 600px;
				left: 1090px;
				position: absolute;
			}
			#banquan{
				top: 800px;
				left: 900px;
				position: absolute;
			}
		</style>
	</head>
	<body>
		<!--设置上层div块 ，id为top01-->
		<div id="top01">
			<img id="top02" src="img/login/topleft.gif" />
			<!--设置上层导航语，id为top03-->
			<div id="top03">
				欢迎使用本管理系统
			</div>
			<!--设置“返回首页”及“帮助”超链接，id为top04-->
			<div id="top04">
				<a href="">返回首页</a>&#160;|&#160;<a href="">帮助</a>
			</div>
		</div>
		<!--标题-->
		<div id="renyuan">人&emsp;员&emsp;管&emsp;理&emsp;系&emsp;统</div>
		<div id="yonghudenglu">
			用户登录&#160;UserLogin
		</div>
		<!--用户名输入框和密码输入框-->
		<div>
			<!--用户名输入框图片，设置id为username-->
			<img id="username" src="img/login/username.gif" />
			<!--添加文本框，id为userna01-->
			<input type="text" id="username01" />
			<!--密码输入框图片 ，设置id为password-->
			<img id="password" src="img/login/pwd.gif" />
			<!--添加密码文本框，id为password01-->
			<input id="password01" type="password" maxlength="12" />
		</div>
		<div>
			<!--设置登录背景图片，id为denglu-->
			<img id="denglu" src="img/login/btn.gif" />
			<!--设置登录链接，id为denglu01-->
			<a href="zhujiemian.html"><p id="denglu01">登&emsp;录</p></a>
			<!--验证码输入框，id为yanzhengma-->
			<input type="text" id="yanzhengma" />
			<!--验证码图片，id为yanzhengma01-->
			<img id="yanzhengma01" src="img/login/verify.png" />
		</div>
		<!--声明版权，id为banquan-->
		<div id="banquan">
			版权所有
		</div>
	</body>
</html>
